<script setup lang="ts">
import { RouterLink, RouterView } from 'vue-router'
</script>

<template>
  <header>
    <div class="wrapper">
      <nav>
        <RouterLink to="/">个券行情F5</RouterLink>
        <RouterLink to="/businessMarket">纪经商行情列表</RouterLink>
      </nav>
    </div>
  </header>

  <RouterView />
</template>

<style scoped lang="less">
header {
  line-height: 1.5;
  max-height: 100vh;
  .logo {
    display: block;
    margin: 0 auto 2rem;
  }

  .wrapper {
    nav {
      margin: 30px 0 15px;
      display: flex;
      width: 100%;
      font-size: 14px;
      text-align: center;
      font-weight: 500;
      a {
        display: inline-block;
        padding-right: 12px;
        &.router-link-exact-active {
          color: var(--color-text);
        }
        &.router-link-exact-active:hover {
          background-color: transparent;
        }
      }
    }
  }
}
</style>
